import {Component, EventEmitter, Input, OnChanges, OnInit, Output} from '@angular/core';

import * as moment from 'moment';
import * as _ from "lodash";

// 日历的每个格子
interface dateObj {
    year: number,
    month: number,
    date: number,//几号
    isThisMonth: boolean,//是否为当前选择的月份
    isToday?: boolean,
    isSelect?: boolean,
    typeWork?: number,
    weekHead?: string
}

@Component({
    selector: 'adp-calendar-month',
    templateUrl: 'adp-calendar-month.html'
})
export class AdpCalendarMonthComponent implements OnInit, OnChanges {

    @Input() actData: any[];

    @Output() onDaySelect = new EventEmitter<dateObj>();
    currentTimestap: number;
    moment = moment;

    currentDate: number;
    currentYear: number;
    currentMonth: number;
    currentDay: number;

    displayYear: number;
    displayMonth: number;

    dateArray: Array<dateObj> = []; // 本月展示的所有天的数组

    weekArray = [];// 保存日历每行的数组

    lastSelect: number = 0; // 记录上次点击的位置

    weekHead: string[] = ['日', '一', '二', '三', '四', '五', '六'];

    /**
     * 当前视图开始时间戳
     */
    get startTimestamp(): number {
        return moment(new Date(this.dateArray[0].year, this.dateArray[0].month, this.dateArray[0].date)).unix();
        // return moment(new Date(this.dateArray[8].year, this.dateArray[8].month, 1)).unix();
    }

    /**
     * 当前视图结束时间戳
     */
    get endTimestamp(): number {
        return moment(new Date(this.dateArray[this.dateArray.length - 1].year, this.dateArray[this.dateArray.length - 1].month, this.dateArray[this.dateArray.length - 1].date)).unix();
        // return moment(new Date(this.dateArray[8].year, this.dateArray[8].month, 1)).unix();
    }

    constructor() {
        this.currentYear = moment().year();
        this.currentMonth = moment().month();
        this.currentDate = moment().date();
        this.currentDay = moment().day();
    }

    ngOnInit() {
        this.goToday()
    }

    ngOnChanges() {
        this.displayYear = this.currentYear;
        this.displayMonth = this.currentMonth;
        let year = moment(this.currentTimestap * 1000).year();
        let month = moment(this.currentTimestap * 1000).month();
        this.createMonth(year, month);
    }

    // 跳转至今天
    goToday() {
        this.displayYear = this.currentYear;
        this.displayMonth = this.currentMonth;
        this.createMonth(this.currentYear, this.currentMonth);

        // 将今天标记为选择状态
        let todayIndex = _.findIndex(this.dateArray, {
            year: this.currentYear,
            month: this.currentMonth,
            date: this.currentDate,
            isThisMonth: true
        })
        this.lastSelect = todayIndex;
        this.dateArray[todayIndex].isSelect = true;

        this.onDaySelect.emit(this.dateArray[todayIndex]);
    }

    createMonth(year: number, month: number) {
        this.dateArray = [];// 清除上个月的数据
        this.weekArray = [];// 清除数据
        let firstDay;//当前选择月份的 1 号星期几,决定了上个月取出几天出来。星期日不用显示上个月，星期一显示上个月一天，星期二显示上个月两天
        let preMonthDays;// 上个月的天数
        let monthDays;// 当月的天数
        let weekDays: Array<dateObj> = [];

        firstDay = moment({year: year, month: month, date: 1}).day();
        // 上个月天数
        if (month === 0) {
            preMonthDays = moment({year: year - 1, month: 11}).daysInMonth();
        } else {
            preMonthDays = moment({year: year, month: month - 1}).daysInMonth();
        }
        // 本月天数
        monthDays = moment({year: year, month: month}).daysInMonth();

        // 将上个月的最后几天添加入数组
        if (firstDay !== 7) { //星期日不用显示上个月
            let lastMonthStart = preMonthDays - firstDay + 1;// 从上个月几号开始
            for (let i = 0; i < firstDay; i++) {
                if (month === 0) {
                    this.dateArray.push({
                        year: year - 1,
                        month: 11,
                        date: lastMonthStart + i,
                        isThisMonth: false,
                        isToday: false,
                        // isSelect: false
                    })
                } else {
                    this.dateArray.push({
                        year: year,
                        month: month - 1,
                        date: lastMonthStart + i,
                        isThisMonth: false,
                        isToday: false,
                        // isSelect: false
                    })
                }
            }
        }

        // 将本月天数添加到数组中
        for (let i = 0; i < monthDays; i++) {
            this.dateArray.push({
                year: year,
                month: month,
                date: i + 1,
                isThisMonth: true,
                isToday: false,
                // isSelect: false,
            })
        }
        if (this.currentYear === year && this.currentMonth === month) {
            let todayIndex = _.findIndex(this.dateArray, {
                year: this.currentYear,
                month: this.currentMonth,
                date: this.currentDate,
                isThisMonth: true
            })
            this.dateArray[todayIndex].isToday = true;
        }

        // 将下个月天数添加到数组中，有些月份显示 6 周，有些月份显示 5 周
        if (this.dateArray.length % 7 !== 0) {
            let nextMonthAdd = 7 - this.dateArray.length % 7;
            for (let i = 0; i < nextMonthAdd; i++) {
                if (month === 11) {
                    this.dateArray.push({
                        year: year + 1,
                        month: 0,
                        date: i + 1,
                        isThisMonth: false,
                        isToday: false,
                        // isSelect: false,
                    })
                } else {
                    this.dateArray.push({
                        year: year,
                        month: month + 1,
                        date: i + 1,
                        isThisMonth: false,
                        isToday: false,
                        // isSelect: false,
                    })
                }

            }
        }

        // 至此所有日期数据都被添加入 dateArray 数组中

        // 将日期数据按照每 7 天插入新的数组中
        for (let i = 0; i < this.dateArray.length / 7; i++) {
            for (let j = 0; j < 7; j++) {
                weekDays.push(this.dateArray[i * 7 + j]);
            }
            this.weekArray.push(weekDays);
            weekDays = [];
        }
        console.log(this.weekArray);

        //周几
        this.weekHead.map((el, index) => {
            this.dateArray.map((el1, index1) => {
                if (index1 % 7 == index) {
                    el1.weekHead = el;
                }
            });
        });

        if (this.actData) {
            this.dateArray.map((val, index) => {
                let todayTimestamp = this.moment(new Date(val.year, val.month, val.date)).unix();
                this.actData.map((val1, index1) => {
                    if (val1.day === todayTimestamp) {
                        val.typeWork = val1.type
                    }
                })
            });
        }
        this.setSelect(this.currentTimestap);
    }

    back() {
        // 处理跨年的问题
        if (this.displayMonth === 0) {
            this.displayYear--;
            this.displayMonth = 11;
        } else {
            this.displayMonth--;
        }
        this.createMonth(this.displayYear, this.displayMonth);
    }

    forward() {
        // 处理跨年的问题
        if (this.displayMonth === 11) {
            this.displayYear++;
            this.displayMonth = 0;
        } else {
            this.displayMonth++;
        }
        this.createMonth(this.displayYear, this.displayMonth);
    }

    // 选择某日期，点击事件
    daySelect(day, i, j) {
        // // 首先将上次点击的状态清除
        // this.dateArray[this.lastSelect].isSelect = false;
        // // 保存本次点击的项
        // this.lastSelect = i * 7 + j;
        // this.dateArray[i * 7 + j].isSelect = true;
        this.onDaySelect.emit(day);
    }

    setSelect(currentTimestap) {
        this.dateArray.map((val) => {
            val.isSelect = this.moment(new Date(val.year, val.month, val.date)).unix() === currentTimestap
        });
        this.currentTimestap = currentTimestap
    }

    setDate(currentTimestap) {
        this.currentTimestap = currentTimestap
    }
}


